import { Shape } from '@antv/x6'
import config, { portAttrs } from '../config'

export const CustomElectric = Shape.Rect.define({
  constructorName: 'custom-electric',
  // width: 20,
  // height: 40,
  // markup: [
  //   {
  //     tagName: 'path',
  //     selector: 'body'
  //   }
  // ],
  // attrs: {
  //   body: {
  //     stroke: config.nodeStroke,
  //     strokeWidth: 1,
  //     fill: 'none'
  //   },
  //   data: {
  //     width: 20,
  //     height: 40,
  //     angle: 0
  //   }
  // },
  width: 20,
  height: 40,
  markup: [
    {
      tagName: 'rect',
      selector: 'body'
    }
  ],
  attrs: {
    body: {
      stroke: config.nodeStroke,
      strokeWidth: 1,
      fill: 'none'
    },
    line: {
      fill: config.nodeStroke,
      stroke: config.nodeStroke
    },
    transverseLine: {
      fill: config.nodeStroke,
      stroke: config.nodeStroke
    },
    co: {
      fill: 'none',
      stroke: config.nodeStroke
    },
    outline: {
      fill: 'none',
      stroke: config.nodeStroke,
      strokeWidth: 2
    },
    filled: {
      fill: config.nodeStroke,
      stroke: config.nodeStroke
    }
  },
  ports: {
    groups: {
      top: {
        position: 'top',
        attrs: portAttrs
      },
      bottom: {
        position: 'bottom',
        attrs: portAttrs
      },
      right: {
        position: 'right',
        attrs: portAttrs
      },
      left: {
        position: 'left',
        attrs: portAttrs
      }
    }
  }
})
